<template>
  <div class="my-collect">
    <!-- Collect -->
    <div class="my-collect-nav">
      <produ-nav :navList="navList"></produ-nav>
    </div>

    <div class="my-collect-list">
      <el-row
        class="my-collect-list-box"
        :gutter="34"
        type="flex"
        justify="space-around"
        style="flex-wrap: wrap"
      >
        <el-col style="width: auto">
          <div class="collect-item">
            <produ></produ>
          </div>
        </el-col>
        <el-col style="width: auto">
          <div class="collect-item">
            <produ></produ>
          </div>
        </el-col>
        <el-col style="width: auto">
          <div class="collect-item">
            <produ></produ>
          </div>
        </el-col>
        <el-col style="width: auto">
          <div class="collect-item">
            <produ></produ>
          </div>
        </el-col>
        <i></i> <i></i> <i></i> <i></i> <i></i> <i></i> <i></i>
      </el-row>
    </div>
  </div>
</template>

<script>
import Produ from "@/views/child/admin/common/produ.vue";
import ProduNav from "@/views/child/admin/common/produ-nav.vue";
export default {
  setup() {
    return {
      navList: [
        {
          index: 1,
          type: "DATAALL",
          span: 3,
          text: "全部",
          num: 9,
        },
        {
          index: 2,
          type: "DATAMOBILE",
          span: 3,
          text: "移动页面",
          num: 9,
        },
        {
          index: 3,
          type: "DATAWEIBO",
          span: 3,
          text: "微博小程序",
          num: 0,
        },
        {
          index: 4,
          type: "DATAOTHER",
          span: 3,
          text: "其他",
          num: 0,
        },
      ],
    };
  },
  components: {
    Produ,
    ProduNav,
  },
  methods: {},
};
</script>

<style lang="scss" scoped>
@import "@/assets/css/admin-collect.scss";
</style>
